import React, { PureComponent } from "react"
import { bindActionCreators } from "redux"
import { connect } from "react-redux"
//import {bindToken} from "libs/socket.io"
import {setCookie} from "libs/cookie"
import cls from "classnames"

/*ant UI*/
import {Form,Icon,Input,Button,Checkbox,Row,Col} from "antd"

import { signin } from "app/user/actions"
import "./styles.less"

import { loginUser, loginPwd } from "./const"
import { copyright } from "app/const"

@connect(
  (state) => ({ state }),
  (dispatch) => (
    bindActionCreators({
      signin
    }, dispatch)
  )
)
export default class Login extends PureComponent {
  state = {
    validateResult: {},
    model: {}
  }
  render() {
    const { getFieldDecorator } = this.props.form;
    return (
      <div className="login">
          <div className="login-box">
            <h4>公安绩效考核管控平3台</h4>
            <h3>绩效考核引领者</h3>
                {/*表单*/}
                <Form onSubmit={this.login} className="login-form">
                  <Form.Item>
                    <Row>
                      <Col span="2">
                        <Icon type="user" style={{ fontSize: 16,marginTop:'10px',color:"#999"}} />
                      </Col>
                      <Col span="22">
                      {getFieldDecorator('userName', {
                        rules: [{ required: true, message: 'Please input your username!' }],
                      })(
                          <Input placeholder="请输入账号" />
                      )}
                      </Col>
                    </Row>
                  </Form.Item>
                  <Form.Item>
                    <Row>
                      <Col span="2">
                        <Icon type="lock" style={{ fontSize: 16,marginTop:'10px',color:"#999"}} />
                      </Col>
                      <Col span="22">
                      {getFieldDecorator('password', {
                        rules: [{ required: true, message: 'Please input your Password!' }],
                      })(
                        <Input type="password" placeholder="请输入密码" />
                      )}
                      </Col>
                    </Row>
                  </Form.Item>
                  <Form.Item>
                    <Row>
                      <Col span="16" offset="2">
                        {getFieldDecorator('remember', {
                          valuePropName: 'checked',
                          initialValue: true,
                        })(
                          <Checkbox><p className="autoLogin">下次自动登录</p></Checkbox>
                        )}
                      </Col>
                      <Col span="6">
                        <Button type="primary" htmlType="submit" className="login-box-button">
                          登录
                        </Button>
                      </Col>
                    </Row>                
                  </Form.Item>
                </Form>
                {/*表单*/}
          </div>
      </div>
    )
  }

  login = async () => {
    const { form:{validateFields},history } = this.props;
    // const { form: { validateForm }, props: { signin, history }, state: { model: {userLoginName, pwd} } } = this
    // if (validateForm()) {
    //   let eCode = await signin({
    //     userLoginName,
    //     pwd: pwd
    //   })
    //   if (validateForm() && !eCode) {
    //     history.push("/app")
    //     bindToken()
    //   } else {
    //     await this.setState({ eCode })
    //     validateForm()
    //   }
    // }
    this.props.form.validateFields((err, values) => {
      if (!err) {
        console.log("Received values of form: ", values);
        this.props.signin({
          userLoginName:values.userName,
          pwd:values.password
        })
        history.push("/index")
      }
    })
  }
  formChange = (model, validateResult) => {
    this.setState({
      validateResult,
      model,
      eCode: 0
    })
  }
  keypress = (e = window.event) => {
    if (e.key === "Enter") {
      this.login()
    }
  }
  componentWillMount() {
    setCookie("token", "", 0)
  }
}

Login = Form.create()(Login)